<template>
	<div class="staff">
		<div class="box" v-for="(item,index) in list" @click="go(item.path)">
		  <i :class="item.icon" :style="{color:item.color}"></i>
		  <p>{{item.title}}</p>
		  <i class="el-icon-erp-gengduo more"></i>
		</div>
	</div>
</template>

<script>
import {data} from '@/common/js/staff'
export default {
	name:'staff',
	data () {
		return {
			list:data.list
		}
	},
	mounted () {
		
	},
	methods:{
		go (path) {
			this.$router.push(path)
		}
	}
}
</script>

<style lang="less" scoped>
  .staff{
  	width:100%;
  	.box{
  		width:100%;
  		height: 90px;
  		background: #FFFFFF;
  		display: flex;
  		.icon{
  			width:100px;
  			font-size: 44px;
  			text-align: center;
  			line-height: 90px;
  		}
  		p{
  			flex: 1;
  			font-size: 30px;
  			color: #000000;
  			line-height: 90px;
  		}
  		.more{
  			width:100px;
  			text-align: center;
  			font-size: 32px;
  			font-weight: 800;
  			color: gainsboro;
  			line-height: 90px;
  		}
  	}
  }

</style>